<template>
    <view class="login">
        <Navigation />
        <view class="f fd-c ai-c mt-151">
            <view class="logo w-160 h-160 f jc-c ai-c">
                <image src="http://cwht.ricecs.cn/app/login/logo.png" class="w-130 h-130"></image>
            </view>
            <view class="fs-60 mt-40 fw-800 text-color1">账号密码登录</view>
            <view class="w-654">
                <view class="w-654 h-96 tel f ai-c mt-64 ph-24">
                    <u-input v-model="tel" type="number" :border="false" placeholder="请输入账号" clearable />
                </view>
                <view class="w-654 h-96 tel f ai-c mt-32 ph-24">
                    <u-input v-model="tel" type="password" :border="false" placeholder="请输入密码" clearable />
                </view>
                <view class="mt-32 f ai-c">
                    <u-checkbox-group>
                        <u-checkbox v-model="iaAgree" shape="circle" size="15" activeColor="#FABB3C"></u-checkbox>
                    </u-checkbox-group>
                    <view class="fs-22 text-color3 f"
                        >登录即表示同意<view class="text-color" @click.stop='toText(6)'>《用户协议》</view>和<view class="text-color"  @click.stop='toText(7)'>《隐私协议》</view>
                    </view>
                </view>
            </view>

            <view class="w-654 h-96 mt-64">
                <u-button text="登录" color="#FABB3C" shape="circle" :disabled="!tel && !iaAgree" @click="toCode"></u-button>
            </view>
            <view @click="toRetrievePassword">忘记密码</view>

            <view class="f ai-c mt-130">
                <view class="heng w-120 h-1"></view>
                <view class="fs-26 mh-10 text-color3">其他方式登录</view>
                <view class="heng w-120 h-1"></view>
            </view>
            <view class="f mt-48">
                <image src="http://cwht.ricecs.cn/app/login/wx.png" class="w-52 h-52 mr-48"></image>
                <image src="http://cwht.ricecs.cn/app/login/zfb.png" class="w-52 h-52"></image>
            </view>
        </view>
    </view>
</template>
<script setup lang="ts">
import { ref } from 'vue';
const iaAgree = ref(false);
const tel = ref('');
const toCode = () => {
    uni.navigateTo({
        url: '/pages_login/code',
    });
};
function toRetrievePassword() {
    uni.navigateTo({
        url: '/pages_login/retrievePassword',
    });
}
	function toText(type:number) {
	    uni.navigateTo({
	        url: '/pages_mine/text?type='+type,
	    });
	}
</script>
<style lang="scss" scoped>
.login {
    background: #ffffff;
    .tel {
        background: #f8f8f8;
        border-radius: 8px;
    }
    .logo {
        background: #fabb3c;
        border-radius: 50%;
    }
    ::v-deep .u-button__text {
        font-size: 36rpx !important;
        font-weight: 600 !important;
    }
    ::v-deep .u-button {
        height: 96rpx !important;
    }
    .heng {
        background: #f5f5f5;
    }
}
</style>
